<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="description" content="" />
    <meta name="author" content="ChongMing" />
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-touch-fullscreen" content="yes">
    <meta name="full-screen" content="yes">
    <meta name="screen-orientation" content="portrait">
    <meta name="x5-fullscreen" content="true">
    <meta name="360-fullscreen" content="true">
    <title>会员中心</title>
</head>
<link rel="stylesheet" href="../css/framework7.ios.min.css">
<link rel="stylesheet" href="../css/framework7.ios.colors.min.css">
<link rel="stylesheet" href="../css/my-app.css">
<link rel="stylesheet" href="../css/reset.css">
<link rel="stylesheet" href="../css/swiper-3.3.1.min.css">
<link rel="stylesheet" href="css/membercenter.css">
<script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="../js/jquery.mobile-1.4.3.js"></script>
<script type="text/javascript" src="../js/swiper-3.3.1.jquery.min.js"></script>
<script type="text/javascript" src="js/membercenter.js"></script>
<script type="text/javascript" src="../js/jquery.cookie.js"></script>
<!--<script src="js/jQuery-jcMarquee.js"></script>-->
<script src="js/jquery.kxbdMarquee.js"></script>
<script src="../js/rem.js"></script>
<script>
    $(function(){
        $("#marquee2").kxbdMarquee({
            isEqual:false,         //所有滚动的元素长宽是否相等,true,false
            loop:0,                 //循环滚动次数，0时无限
            direction:"left",       //滚动方向，"left","right","up","down"
            scrollAmount:1,
            scrollDelay:40
        });
//        弹幕接口
        membercenter.get('memberCenter/getMemberBarrageList',{page_index:1},function(res){
            if(res.ret==0){
                console.log(res);
                var data = res.data;
                $.each(data,function(i,t){
                    $('.membercenter .barrage ul').append('<li><div class="strip"><div style=" background: url('+ t.avatar+') center; background-size: cover;" class="headpic"></div><div class="center"><p class="p1">'+ t.mobile+'</p><p class="p2">(成功'+ t.product_name+')</p></div><img src="'+ t.icon+'" class="grade"></div></li>');
                    setInterval(function(){
                        $('.membercenter .barrage ul li').eq(i*2).css('marginTop','0.7rem')
                    },100);
                });
                $("#marquee1").kxbdMarquee({
                    isEqual:true,         //所有滚动的元素长宽是否相等,true,false
                    loop:0,                 //循环滚动次数，0时无限
                    direction:"left",       //滚动方向，"left","right","up","down"
                });
            }
            else{
                alert(res.msg);
            }
        });
    });
</script>
</body>
<body style=" background: #ebebeb;  margin: auto;-webkit-overflow-scrolling: touch;overflow: scroll;">
<div class="membercenter">
    <!--弹幕-->
    <div class="barrage" id="marquee1">
            <ul>
                <!--<li>-->
                    <!--<div class="strip">-->
                        <!--<div style=" background: url(img/zwt.png) center; background-size: cover;" class="headpic"></div>-->
                        <!--<div class="center">-->
                            <!--<p class="p1">137****2446</p>-->
                            <!--<p class="p2">(成功充值991元)</p>-->
                        <!--</div>-->
                        <!--<img src="img/icon1.png" class="grade">-->
                    <!--</div>-->
                <!--</li>-->
                <!--<li>-->
                    <!--<div class="strip">-->
                        <!--<div style=" background: url(img/zwt.png) center; background-size: cover;" class="headpic"></div>-->
                        <!--<div class="center">-->
                            <!--<p class="p1">137****2446</p>-->
                            <!--<p class="p2">(成功充值992元)</p>-->
                        <!--</div>-->
                        <!--<img src="img/icon1.png" class="grade">-->
                    <!--</div>-->
                <!--</li>-->
            </ul>
        <!--<div id="Marquee_x">-->
            <!---->
        <!--</div>-->
    </div>
</div>
</body>
</html>